<template>
  <div class="config-place-placeDetail detail f-14" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.8)">
    <div class="fr ac">
      <h2 class="title f1">场所编辑</h2>
      <div class="f-14 a link" @click="importBox.show = true">批量导入<i class="el-icon-plus b ml-5"></i></div>
    </div>
    <div class="card">
      <div class="fr ac item">
        <div class="label">场所ID</div>
        <span>{{form.placeid}}</span>
      </div>
      <div class="fr ac item">
        <div class="label">场所名称</div>
        <el-input v-model="form.placename"/>
      </div>
      <div class="fr ac item">
        <div class="label">场所位置</div>
        <el-input v-model="form.placeseat"/>
      </div>
      <div class="tc mt-30">
        <el-button type="primary" @click="submit" :loading="submiting">保存</el-button>
      </div>
    </div>

    <import-box :show.sync="importBox.show"
                :demo-url="`/api/tplace/template/export?userid=${$store.state.user.userid}`"
                :url="`/api/tplace/tplaceimport?userid=${$store.state.user.userid}`"/>
  </div>
</template>

<script>
  import moment from '@/utils/moment'

  export default {
    name: 'config-place-placeDetail',
    props: [ 'id' ],
    data () {
      return {
        loading: false,
        submiting: false,
        form: {
          pid: '',
          placeid: '',
          placename: '',
          placeseat: ''
        },
        importBox: {
          show: false
        }
      }
    },
    methods: {
      getDetail () {
        this.loading = true
        const form = {}
        if (this.id) form.placeid = this.id
        this.$http('/tplace/form', form).then(
          res => {
            console.log(res)
            const { data = {} } = res
            for (const k in this.form) {
              this.form[k] = data[k] || ''
            }
            this.loading = false
          }
        )
      },
      validate () {
        if (!this.form.placename) {
          this.$notify.warning('请输入场所名称')
          return false
        }
        if (!this.form.placeseat) {
          this.$notify.warning('请输入场所位置')
          return false
        }
        return true
      },
      submit () {
        if (!this.validate()) return
        const form = Object.assign({}, this.form)
        const { id } = this
        if (!id) form.createtime = moment().format('YYYY-MM-DD HH:mm:ss')
        if (!form.pid) delete form.pid
        this.submiting = true
        this.$http('/tplace/saveOrUpdate', form).then(
          res => {
            console.log(res)
            this.$notify({
              title: '成功',
              message: `${id ? '保存' : '创建'}成功`,
              type: 'success'
            })
            this.submiting = false
            this.$router.replace('/config/place')
          }
        )
      }
    },
    created () {
      this.getDetail()
    }
  }
</script>
